import './App.css';
import  Video from './Video.js'
import {useState,useEffect} from 'react'
// import db from "./firebase";
function App() {
  const [Videos, setVideos] = useState([])
  // useEffect(() => {
  //   db.collection("Videos").onSnapshot((snapshot) =>
  //     setVideos(snapshot.docs.map((doc) => doc.data()))
  //   );
  // }, []);
  return (
    //BEM
    <div className="App">
      <div className="app_videos">
        <Video
        url='http://localhost:3000/v39-jp.tiktokcdn.com.mp4'
        description='houzi hahaha'
        song='hoho hahaha'
        likes={3}
        messages={1}
        shares={1}
        channel='raff_'
        ></Video> 
        <Video
        url='http://localhost:3000/v39-jp.tiktokcdn.com.mp4'
        description='boody'
        song='show me what'
        messages={88}
        shares={99}
        channel='beauty'
        likes={666}></Video>
        <Video></Video>
{/* {Videos.map(
  ({url,channel,description,song,likes,messages,shares})=>(
    <Video>
url={url}
channel={channel}
likes={likes}
song={song}
shares={shares}
messages={messages}
description={description}
    </Video>
  ) 
  )} */}
      </div>
    </div>
  );
}

export default App;
